import React, { useEffect, useState } from 'react';
import { Button, Form, Input, Select, Breadcrumb, Space, Col, Row, Checkbox, DatePicker, } from 'antd';
import { useNavigate } from 'react-router-dom';
import service from '../../../../../api';
import './Addcoupon.scss'
import { useSearchParams } from 'react-router-dom'
import { useDispatch ,useSelector} from 'react-redux'

const { RangePicker } = DatePicker;
const { TextArea } = Input;

function Addcoupon(props: any) {
    var [text, setText] = useState([])
    let [params, setParams] = useSearchParams ();
    let [id, setid] = useState();

    var info = async () => {
      var id= params.get('id') 

        // var res3 = await service.marketing.conpon_info({ id })
        // // console.log(res3);
        // setText(res3.data)
    }
    useEffect(() => {
        info()
    }, [])
    var navigate = useNavigate()
    //返回
    const back = () => {
        navigate('/index/coupon')
    }
    //提交
    var onFinish = async (formvalues: any) => {
        if (id) {
            // alert(222)
        } else {
            // alert(111)
            const time = (formvalues.time[0].$y) + "/" + (formvalues.time[0].$M + 1) + "/" + (formvalues.time[0].$D) + " - " + (formvalues.time[1].$y) + "/" + (formvalues.time[1].$M + 1) + "/" + (formvalues.time[1].$D)
            var res = await service.marketing.conpon_add({ name: formvalues.name, coupon: formvalues.coupon, decrement: formvalues.decrement, states: formvalues.states, time: time, range: formvalues.range, channel: formvalues.channel })            // console.log(text);
        }


        navigate('/index/coupon')

    }
    return (
        <div className='addcoupon'>
            <div className="head">
                <div className="top">
                    <div className="bread">
                        <Breadcrumb>
                            <Breadcrumb.Item>营销</Breadcrumb.Item>
                            <Breadcrumb.Item>
                                <a href="">优惠券</a>
                            </Breadcrumb.Item>
                        </Breadcrumb>
                    </div>
                    {id ? <h2>编辑优惠券</h2> : <h2>新建优惠券</h2>}

                </div>

            </div>
            <div className='form'>
                <Form
                    labelCol={{ span: 4 }}
                    wrapperCol={{ span: 14 }}
                    layout="horizontal"
                    style={{ maxWidth: 600 }}
                    onFinish={onFinish}

                >
                    <Form.Item name='name' label="优惠券名称" >
                        <Input />
                    </Form.Item>
                    <Form.Item name="coupon" label="优惠券类型">
                        <Select
                            style={{ marginRight: 30 }}
                            options={[
                                { value: '全部', label: '全部' },
                                { value: '满减券', label: '满减券' },
                                { value: '折扣券', label: '折扣券' },
                                { value: '兑换券', label: '兑换券' },
                                { value: '随机金额券', label: '随机金额券' },
                            ]}
                        />
                    </Form.Item>
                    <Form.Item name="states" label="状态">
                        <Select
                            style={{ marginRight: 30 }}
                            options={[
                                { value: '全部', label: '全部' },
                                { value: '未开始', label: '未开始' },
                                { value: '进行中', label: '进行中' },
                                { value: '已结束', label: '已结束' },
                            ]}
                        />
                    </Form.Item>

                    <Form.Item name="channel" label="使用渠道">
                        <Checkbox.Group style={{ width: '100%' }}
                        //onChange={onChange}
                        >
                            <Row>
                                <Col span={20}>
                                    <Checkbox value="weixin"> 微信商城</Checkbox>
                                </Col>
                                <Col span={20}>
                                    <Checkbox value="pc">PC网站</Checkbox>
                                </Col>
                                <Col span={20}>
                                    <Checkbox value="app"> App</Checkbox>
                                </Col>
                            </Row>
                        </Checkbox.Group>
                    </Form.Item>

                    <Form.Item name='decrement' label="满减商品" >
                        <Input />
                    </Form.Item>
                    <Form.Item name='range' label="使用范围">
                        <Select>
                            <Select.Option value="全场通用">全场通用</Select.Option>
                            <Select.Option value="店铺通用">店铺通用</Select.Option>
                        </Select>
                    </Form.Item>
                    <Form.Item name='time' label="有效期">
                        <RangePicker />
                    </Form.Item>

                    <Form.Item label="操作">
                        <Button htmlType="submit" style={{ marginRight: 30 }}>
                            提交
                        </Button>
                        <Button htmlType="button"
                            onClick={back}
                        >
                            返回
                        </Button>
                    </Form.Item>
                </Form>
            </div>
        </div >
    );
}

export default Addcoupon;